<template>
  <el-form ref="homeownersRef" :model="modelValue" :rules="rules" :disabled="disabled" label-width="80px" label-position="left">
    <div class="flex items-center justify-between">
      <el-text tag="b">业主信息</el-text>
      <el-button v-if="!disabled" type="primary" @click="saveHomeowners">保存</el-button>
    </div>
    <hr>
    </hr>

    <el-row :gutter="20">
      <el-col :span="12">
        <el-form-item label="业主姓名" prop="name">
          <el-input v-model="modelValue.name" v-trim placeholder="" />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="联系电话" prop="phone">
          <el-input v-model="modelValue.phone" v-trim placeholder="请输入" />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="身份证" prop="identityNumber">
          <el-input v-model="modelValue.identityNumber" v-trim placeholder="请输入" />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="是否启用账号" prop="isUse" label-width="auto">
          <el-switch v-model="modelValue.isUse" :active-value="1" :inactive-value="0" inline-prompt active-text="是" inactive-text="否" />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="业主证件-正面" prop="identityFileVo" label-width="auto">
          <image-upload v-model="modelValue.identityFileVo" :fileType="['png', 'jpg', 'jpeg']" :limit="1" />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="业主证件-反面" prop="identityFileTwoVo" label-width="auto">
          <image-upload v-model="modelValue.identityFileTwoVo" :fileType="['png', 'jpg', 'jpeg']" :limit="1" />
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>

<script setup>
import { ElMessage } from 'element-plus'
import { useRouter } from 'vue-router'
import { addHomeownersInfo, updateHomeownersInfo } from '@/api/fang/homeowners'

const router = useRouter()
const homeownersRef = ref(null)

const rules = {
  name: [
    { required: true, message: '请输入业主姓名', trigger: 'blur' },
    { min: 2, max: 20, message: '姓名长度应为 2-20 个字符', trigger: 'blur' }
  ],
  phone: [
    { required: true, message: '请输入联系电话', trigger: 'blur' },
    { pattern: /^1[3-9]\d{9}$/, message: '请输入有效的手机号', trigger: 'blur' }
  ],
  identityNumber: [
    { required: true, message: '请输入身份证号', trigger: 'blur' },
    {
      pattern: /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}[\dXx]$/,
      message: '请输入正确的身份证号码',
      trigger: 'blur'
    }
  ]
}

const props = defineProps({
  modelValue: {
    type: Object,
    required: true
  },
  disabled: {
    type: Boolean,
    default: false
  },
  mode: {
    type: String,
    default: 'create' // 'create' | 'edit'
  },
  showActions: {
    type: Boolean,
    default: true
  }
})

const emit = defineEmits(['saved'])

function saveHomeowners() {
  if (!homeownersRef.value) return

  homeownersRef.value.validate(valid => {
    if (!valid) return
    // 直接从 props 的 modelValue 读取
    const reqData = {
      id: props.modelValue.id,
      name: props.modelValue.name,
      phone: props.modelValue.phone,
      isUse: props.modelValue.isUse,
      identityNumber: props.modelValue.identityNumber,
      identityFile: props.modelValue.identityFileVo?.[0]?.id,
      identityFileUrl: props.modelValue.identityFileVo?.[0]?.url,
      identityFileVo: props.modelValue.identityFileVo?.[0],
      identityFileTwo: props.modelValue.identityFileTwoVo?.[0]?.id,
      identityFileTwoUrl: props.modelValue.identityFileTwoVo?.[0]?.url,
      identityFileTwoVo: props.modelValue.identityFileTwoVo?.[0],
    }
    if (props.mode === 'edit' && reqData.id != null) {
      updateHomeownersInfo(reqData).then(() => {
        ElMessage.success('修改成功')
        emit('saved')
      })
    } else {
      addHomeownersInfo(reqData).then(response => {
        const homeownerId = response?.data?.id
        if (!homeownerId) {
          ElMessage.error('新增成功但未返回ID')
          return
        }
        ElMessage.success('新增成功')
        router.replace('/fang/homeowner/' + homeownerId)
      })
    }
  })
}

function resetFields() {
  if (homeownersRef.value) {
    homeownersRef.value.resetFields()
  }
}

defineExpose({
  validate: (cb) => homeownersRef.value?.validate(cb),
  resetFields
})
</script>


